// 全局变量
let currentPage = 1;
let totalPages = 1;
let totalMessages = 0;
const pageSize = 5;

// 页面加载时初始化
window.onload = function() {
    // 加载留言列表
    loadMessages();

    // 绑定表单提交事件
    document.getElementById('messageForm').addEventListener('submit', function(e) {
        e.preventDefault();
        validateForm(this);
    });

    // 绑定分页按钮事件
    document.getElementById('firstPage').addEventListener('click', () => loadMessages(1));
    document.getElementById('prevPage').addEventListener('click', () => loadMessages(Math.max(1, currentPage - 1)));
    document.getElementById('nextPage').addEventListener('click', () => loadMessages(Math.min(totalPages, currentPage + 1)));
    document.getElementById('lastPage').addEventListener('click', () => loadMessages(totalPages));
};

// 加载留言列表
function loadMessages(page = 1) {
    const container = document.getElementById('messagesContainer');
    container.innerHTML = '<div class="alert">正在加载留言，请稍候...</div>';

    fetch(`message?page=${page}&pageSize=${pageSize}`)
        .then(response => response.json())
        .then(data => {
            if (data && data.length > 0) {
                totalMessages = data.total || data.length;
                currentPage = page;
                totalPages = Math.ceil(totalMessages / pageSize);

                // 更新统计数据
                document.getElementById('totalMessages').textContent = totalMessages;
                document.getElementById('todayMessages').textContent = data.todayMessages || 0;
                document.getElementById('replyRate').textContent = data.replyRate || '0%';

                // 渲染留言列表
                renderMessages(data);

                // 更新分页信息
                updatePagination();
            } else {
                container.innerHTML = '<div class="alert">暂无留言，快来发布第一条留言吧！</div>';
            }
        })
        .catch(error => {
            container.innerHTML = `<div class="alert alert-error">加载留言失败: ${error.message}</div>`;
        });
}

// 渲染留言列表
function renderMessages(messages) {
    const container = document.getElementById('messagesContainer');
    let html = '';

    messages.forEach(msg => {
        html += `
            <div class="message-item" onmouseover="this.style.backgroundColor='#EFEFEF'" onmouseout="this.style.backgroundColor='#FFFFFF'">
                <div class="message-header">
                    <div class="message-author">${msg.name}</div>
                    <div class="message-time">${formatDateTime(msg.postTime)}</div>
                </div>
                <div class="message-content">
                    <div>${msg.content}</div>
                </div>
                ${msg.replyContent ? `
                <div class="message-reply">
                    <div>
                        <strong>回复：</strong> ${msg.replyContent}
                        <div class="reply-time">回复时间: ${formatDateTime(msg.replyTime)}</div>
                    </div>
                </div>` : ''}
                <div class="contact-info">
                    <div>
                        <div>📧 ${msg.email}</div>
                        <div>👤 QQ: ${msg.qq}</div>
                    </div>
                </div>
            </div>
        `;
    });

    container.innerHTML = html;
}

// 更新分页信息
function updatePagination() {
    document.getElementById('currentPage').textContent = currentPage;
    document.getElementById('totalPages').textContent = totalPages;
    document.getElementById('totalCount').textContent = totalMessages;

    // 更新页码显示
    let pageNumbersHtml = '';
    const startPage = Math.max(1, currentPage - 2);
    const endPage = Math.min(totalPages, startPage + 4);

    for (let i = startPage; i <= endPage; i++) {
        if (i === currentPage) {
            pageNumbersHtml += `<span class="current">${i}</span>`;
        } else {
            pageNumbersHtml += `<a href="#" onclick="loadMessages(${i})">${i}</a>`;
        }
    }

    document.getElementById('pageNumbers').innerHTML = pageNumbersHtml;
}

// 格式化日期时间
function formatDateTime(dateString) {
    if (!dateString) return '';
    const date = new Date(dateString);
    return date.toLocaleString('zh-CN');
}

// 表单验证
function validateForm(form) {
    // 昵称验证
    const name = form.name.value.trim();
    if (!name) {
        alert('昵称不能为空');
        form.name.focus();
        return false;
    }

    // QQ验证
    const qq = form.qq.value.trim();
    if (!qq) {
        alert('QQ不能为空');
        form.qq.focus();
        return false;
    }
    if (isNaN(qq)) {
        alert('QQ号码只能是数字');
        form.qq.focus();
        return false;
    }
    // 添加实验报告中的QQ长度验证
    if (qq.length < 5) {
        alert('QQ号码位数不正确！');
        form.qq.focus();
        return false;
    }

    // 邮箱验证
    const email = form.email.value.trim();
    if (!email) {
        alert('邮箱不能为空');
        form.email.focus();
        return false;
    }
    const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
    if (!emailRegex.test(email)) {
        alert('请输入有效的邮箱地址');
        form.email.focus();
        return false;
    }

    // 留言内容验证
    const content = form.content.value.trim();
    if (!content) {
        alert('留言内容不能为空');
        form.content.focus();
        return false;
    }
    if (content.length < 10) {
        alert('留言内容至少需要10个字符');
        form.content.focus();
        return false;
    }

    // 提交表单数据
    const formData = {
        name: name,
        qq: qq,
        email: email,
        content: content
    };

    fetch('message', {
        method: 'POST',
        headers: {
            'Content-Type': 'application/json'
        },
        body: JSON.stringify(formData)
    })
        .then(response => response.json())
        .then(data => {
            if (data.success) {
                alert('留言提交成功！');
                form.reset();
                document.getElementById('Ly').classList.add('hidden');
                // 重新加载留言列表
                loadMessages();
            } else {
                alert('留言提交失败：' + (data.error || '未知错误'));
            }
        })
        .catch(error => {
            alert('网络错误：' + error.message);
        });

    return false;
}

// 切换留言表单显示/隐藏
function toggleForm() {
    const form = document.getElementById('Ly');
    form.classList.toggle('hidden');

    if (!form.classList.contains('hidden')) {
        form.scrollIntoView({ behavior: 'smooth' });
    }
}

// 实验报告中的ly()函数
function ly() {
    toggleForm();
}

// 实验报告中的删除确认函数
function del(id) {
    if (confirm('确定要删除这条留言吗？')) {
        // 这里添加实际的删除操作
        alert('已成功删除');
    }
}

// 跳转到指定页
function goToPage() {
    const page = parseInt(document.getElementById('pageInput').value);
    if (!isNaN(page) && page > 0 && page <= totalPages) {
        loadMessages(page);
    } else {
        alert(`请输入有效的页码 (1-${totalPages})`);
    }
}